import React from 'react';
import './user.scss';
import { getUserInfo, logOut } from 'api/user.js';
import Button from 'material-ui/Button';
import {
  Link
} from 'react-router-dom';
import { message } from 'antd';
class User extends React.Component{
	constructor (props) {
		super(props)
		this.state={
			img1:'',
			username:'',
			pay_status:0
		}
	}
	_getUserInfo () {
		getUserInfo({}).then(res => {
      if (res.code === 1) {
      	this.setState({
      		img1:res.data.user_info.userInfo.user_avatar,
      		username:res.data.user_info.userInfo.user_name
      	})
      } else if(res.code === -403){
      	this.props.history.push({
            pathname: '/login'
          })
      }
		})
	}
	_logOut () {
		logOut({}).then(res => {
      if (res.code === 1) {
      	message.success('退出成功！', 3, this.props.history.push('/login'))
      }
		})
	}
	goBack () {
    this.props.history.goBack()
  }
	componentDidMount () {
		this._getUserInfo();
	}
	render() {
		return (
			<div className='user-form'>
				<div className="user_header">
					<div className="glyphicon glyphicon-back card_hide" onClick={this.goBack.bind(this)}></div>
					<span>
						{/*<Link to="/user/message">*/}<img src="../images/sy/xiaoxi.png"/>{/*</Link>*/}
					</span>
					<div className="message_img">
						{
							this.state.img1 === null ?
							<img src="../../images/default/logo.png"/>
							: <img src={this.state.img1}/>
						}
						<p>{this.state.username}</p>
					</div>
				</div>
				<div className="user_content">
					<div>
						<Link to={
							{
                pathname: '/user/order',
                state:{pay_status:0}
              }
						} className="user_dd flew">
							<div>全部订单</div>
							<div>查看全部订单></div>
						</Link>
					</div>
					<div className="user_jc flew">
						<div>
							<Link to={
								{
	                pathname: '/user/order',
	                state:{pay_status:1}
	              }
							}>
								<span className="user_one"></span>
								<p>待付款</p>
							</Link>
						</div>
						<div>
							<Link to={
								{
	                pathname: '/user/order',
	                state:{pay_status:2}
	              }
							}>
								<span className="user_two"></span>
								<p>待发货</p>
							</Link>
						</div>
						<div>
							<Link to={
								{
	                pathname: '/user/order',
	                state:{pay_status:4}
	              }
							}>
								<span className="user_three"></span>
								<p>待收货</p>
							</Link>
						</div>
						<div><span className="user_four"></span><p>退货及退款</p></div>
					</div>
					<div className="user_list">
            <Button variant="raised" fullWidth={true}>
              <Link to="/Cart">
                <div>
              		<span>
              			<img src="../images/user/jinhuodan_icon.png" style={{width: '1.5rem', height: '1.5rem'}}/>
              		</span>
  								<span>进货单</span>
                </div>
  							<i className="glyphicon glyphicon-right user_right"></i>
              </Link>
            </Button>
            <Button variant="raised" fullWidth={true}>
            	<Link to="/user/shipAddress">
	              <div>
	              	<span><img src="../images/user/dizhi_icon.png" style={{width:'1.5rem', height: '1.5rem'}}/></span>
	              	<span>收货地址</span>
	              </div>
              	<i className="glyphicon glyphicon-right user_right"></i>
	            </Link>
            </Button>
						<Button variant="raised" fullWidth={true}>
							<Link to="/collect">
								<div>
									<span>
										<img src="../images/user/shoucang_icon.png" style={{width:'1.5rem', height: '1.5rem'}}/>
									</span>
									<span>收藏夹</span>
								</div>
								<i className="glyphicon glyphicon-right user_right"></i>
							</Link>
						</Button>
          </div>
					<div className="help user_list">
						<Button variant="raised" fullWidth={true}>
								<div>
									<span><img src="../images/user/bangzhu_icon.png" style={{width:'1.5rem', height: '1.5rem'}}/></span>
									<span>帮助中心</span>
								</div>
								<i className="glyphicon glyphicon-right user_right"></i>
						</Button>
					</div>
					<div className="yy">
						<Button variant="raised" fullWidth={true} className="out" onClick={this._logOut.bind(this)}>
							<span>退出</span>
						</Button>
					</div>
				</div>
			</div>
		)
	}
}

export default User
